<style type="text/css">
.ui-jqgrid-sortable {
	text-align: center;
}
</style>

<div id="courtRole_container">
	<div class="row">
		<div class="col-xs-12">



			<table id="courtRole_grid-table"></table>

			<div id="courtRole_grid-pager"></div>

		</div>
		<!-- /.col -->
	</div>
	<!-- /.row -->


	<div id="courtRoleModalDiv" class="modal fade" tabindex="-1"
		data-backdrop="static">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header no-padding">
					<div class="table-header">
						<button type="button" class="close" data-dismiss="modal"
							aria-hidden="true">
							<span class="white">&times;</span>
						</button>
						<span id="courtRoleTitle">添加角色</span>
					</div>
				</div>
				<div class="modal-body"
					style="max-height: 450px; overflow-y: scroll;">
					<div id="modal-tip" class="red clearfix"></div>
					<form id="courtRoleForm" name="courtRoleForm"
						class="form-horizontal  col-xs-12">
						<div class="widget-box  ui-sortable-handle">
							<div class="widget-header">
								<h4 class="widget-title">基本信息</h4>
							</div>
							<div class="widget-body">
								<input type="hidden" name="id" id="courtRoleId" />
								<div class="widget-main">
									<div class="row" style="padding-bottom: 2px">
										<div class="form-group">
											<label class="col-sm-3 control-label">角色名称</label>
											<div class="col-sm-9">
												<input type="text" class="form-control" id="courtRoleName"
													name="roleName" />
											</div>
										</div>
									</div>
									<div class="row" style="padding-bottom: 2px">
										<div class="form-group">
											<label class="col-sm-3 control-label">角色权重</label>
											<div class="col-sm-9">
												<input type="text" class="form-control" id="courtRoleWeight" name="roleWeight" />
											</div>
										</div>
									</div>
									<div class="row" style="padding-bottom: 2px">
										<div class="form-group">
											<label class="col-sm-3 control-label">角色描述</label>
											<div class="col-sm-9">
												<textarea id="courtRoleDesc" name="roleDesc"
												class="autosize-transition form-control" rows="10"></textarea>
											</div>
										</div>
									</div>
								</div>
							</div>
						</div>
					</form>
				</div>
				<div class="modal-footer no-margin-top">
					<div class="text-center">

						<button id="submitCourtRoleBtn" class="btn btn-sm btn-primary">
							<i class="ace-icon fa fa-floppy-o"></i> <span>保存</span>
						</button>

						<button class="btn btn-sm" data-dismiss="modal">
							<i class="ace-icon fa fa-share "></i> <span>取消</span>
						</button>
					</div>
				</div>
			</div>
		</div>
		<!-- /.modal-content -->
	</div>
	<!-- /.modal-dialog -->
</div>

<script type="text/javascript">
	var courtRoleScripts = [ null, null ];
	var $courtRoleContainer = $('#courtRole_container');
	var courtRoleGrid = null;
	var $validateCourtRoleForm = null;

	$('.page-content-area').ace_ajax('loadScripts',courtRoleScripts,
		function() {
			var grid_selector = "#courtRole_grid-table";
			var pager_selector = "#courtRole_grid-pager";

			var colNames = [ '', '角色名称', '角色权重', '角色描述', '操作' ];
			createCourtGrid();

			$validateCourtRoleForm = $('#courtRoleForm', $courtRoleContainer).validate({
				onsubmit : false,
				rules : {
					roleName : {
						required : true,
						maxlength: 25
					},
					roleDesc : {
						required : true,
						maxlength: 55
					},
					roleWeight : {
						required : true,
						digits:true
					}
				}
			});

			$('#submitCourtRoleBtn').click(
					function() {
						if (!$validateCourtRoleForm.checkForm()) {
							$validateCourtRoleForm.defaultShowErrors();
							return;
						}
						var url = $(this).attr("url");
						var fileIds = [];
						var id = $('#courtRoleId',$("#courtRoleForm", $courtRoleContainer)).val();
						var message = "";
						if (id && id != "") {
							message = "确定要修改这条记录吗？"
						} else {
							message = "确定要添加一条记录吗？"
						}
						$.loy.confirm(message, function() {
							$.loy.ajax({
								url : url,
								data : $("#courtRoleForm",$courtRoleContainer).serialize(),
								success : function(data) {
									$('#courtRoleModalDiv',$courtRoleContainer).modal("hide");
									courtRoleGrid.jqGrid().trigger("reloadGrid");
								},
								error : function(data) {
									alert("发生错误");
								}
							});
						});
					});

			function createCourtGrid() {
				courtRoleGrid = jQuery(grid_selector).loyGrid(
				{
					url : 'ywh/findAll',
					datatype : "json",
					mtype : 'GET',
					colNames : colNames,
					colModel : [
							{
								name : 'id',
								index : 'id',
								sortable : false,
								width : 1,
								align : "center",
								editable : true,
								hidden : true
							},
							{
								name : 'roleName',
								index : 'roleName',
								sortable : false,
								width : 200,
								align : "center",
								editable : true
							},
							{
								name : 'roleWeight',
								index : 'roleWeight',
								sortable : false,
								width : 150,
								align : "center",
								editable : true
							},
							{
								name : 'roleDesc',
								index : 'roleDesc',
								sortable : false,
								width : 300,
								align : "center",
								editable : true
							},
							{
								name : '',
								index : '',
								width : 200,
								fixed : true,
								sortable : false,
								resize : false,
								align : "center",
								formatter : function(
										cellvalue,
										options,
										rowObject) {
									var button = '';
									if (hasPermissionByCode('resource:update')) {
										button += '<div title="'
												+ $.jgrid.nav.edittitle
												+ '" onclick=courtRoleEdit("'
												+ rowObject.id
												+ '");  style="float:left;margin-left:70px;" class="ui-pg-div ui-inline-del"  onmouseover="jQuery(this).addClass(\'ui-state-hover\');" onmouseout="jQuery(this).removeClass(\'ui-state-hover\');"  data-original-title="所选记录"><span class="ui-icon ui-icon-pencil"></span></div>';
									}
									if (hasPermissionByCode('resource:del')) {
										var del = '<div title="'
												+ $.jgrid.nav.deltitle
												+ '" onclick=courtRoleDel("'
												+ rowObject.id
												+ '");  style="float:left;margin-left:5px;" class="ui-pg-div ui-inline-del"  onmouseover="jQuery(this).addClass(\'ui-state-hover\');" onmouseout="jQuery(this).removeClass(\'ui-state-hover\');"  data-original-title="所选记录"><span class="ui-icon ace-icon ace-icon fa fa-trash-o red"></span></div>';
										button += del;
									}
									return button;
								}
							} ],
					pager : pager_selector,
					width : $(this).jqGrid('setGridWidth', $(".page-content").width()),
					height : getGridDefaultHeight(),
				}).loyGrid('navGrid',
				'#courtRole_grid-pager', {
					"addfunc" : function() {
						courtRoleAdd('');
					},
					view : false,
					add : true,
					edit : false,
					del : false,
					excel : false
				});
				courtRoleGrid.jqGrid('setFrozenColumns');
			}

		});
	function clearCourtForm() {
		$validateCourtRoleForm.resetForm();
		$('#courtRoleId', $courtRoleContainer).val('');
		$("#courtRoleName", $courtRoleContainer).val('');
		$('#courtRoleWeight', $courtRoleContainer).val(0);
		$('#courtRoleDesc', $courtRoleContainer).val('');
	}
	function courtRoleEdit(id) {
		clearCourtForm();
		$("#courtRoleTitle").text("修改业委会角色");
		$('#submitCourtRoleBtn', $courtRoleContainer).attr("url", "ywh/addywhInfo");
		$('#courtRoleModalDiv', $courtRoleContainer).modal("show");
		$.loy.ajax({
			url : 'ywh/findOne',
			shade : false,
			data : {
				id : id
			},
			success : function(data) {
				var result = data.data;
				$('#courtRoleId', $courtRoleContainer).val(result.id ? result.id : '');
				$('#courtRoleName', $courtRoleContainer).val(result.roleName ? result.roleName : '');
				$('#courtRoleWeight', $courtRoleContainer).val(result.roleWeight ? result.roleWeight : '');
				$('#courtRoleDesc', $courtRoleContainer).val(result.roleDesc ? result.roleDesc : '');
			}
		});
	}
	function courtRoleAdd(parentId) {
		clearCourtForm();
		$("#courtRoleTitle").text("添加业委会角色");
		$('#submitCourtRoleBtn', $courtRoleContainer).attr("url", "ywh/addywhInfo");
		$('#courtRoleModalDiv', $courtRoleContainer).modal("show");
	}
	function courtRoleDel(id) {
		var that = this;
		$.loy.confirm($.i18n.prop('confirm_info_del'), function() {
			$.loy.ajax({
				url : 'ywh/delywhInfo',
				data : {
					id : id
				},
				success : function(data) {
					that.refreshGrid();
				}
			});
		});
	}
	function refreshGrid() {
		courtRoleGrid.jqGrid().trigger("reloadGrid");
	}
</script>